<html>
{% autoescape on %}

<style>
body {
    font-family: arial;
}
h1 {
    font-size: 20px;
}

table.tasks_tree {
    border-collapse: collapse;
}
table.tasks_tree td {
    background:lightgray;
    border-collapse: collapse;
}
table.tasks_tree tr.current_task td {
    background:blue;
}
table.tasks_tree form.task {
    padding: 0;
    margin: 5px;
}
table.tasks_tree form {
    padding: 0;
    margin: 0;
}
table.tasks_tree {
    width: 100%;
}

table.switches {
    border: solid 1px gray;
    border-collapse: collapse;
}
table.switches td {
    border: solid 1px gray;
    padding: 5px;
}
table.switches td {
    border: solid 1px gray;
    padding: 5px;
}
</style>

<body>

<h1>Activities:</h1>

<table class="tasks_tree">
{% for task in tasks %}
    <tr
        {% if task.task.key.id == context.root.last_task_switch.task.key.id %}
            class="current_task"
        {% endif %}
    >

        <td><form action="/tasks/switch" method="post">
            <input type="hidden" name="task" value="{{ task.task.key.id }}" />
            <input type="submit" value="A" />
        </form></td>

        <td><form action="/tasks/delete" method="post">
            <input type="hidden" name="task" value="{{ task.task.key.id }}" />
            <input type="submit" value="X" />
        </form></td>

        <td><form action="/tasks/new" method="post">
            <input type="hidden" name="parent_task" value="{{ task.task.key.id }}" />
            <input type="submit" value="S" />
        </form></td>

        <td width="100%" style="padding-left:{% widthratio task.level 10 200 %}px">
        <form class="task" action="/tasks/update" method="post">
            <input type="hidden" name="task" value="{{ task.task.key.id }}" />
            <input class="text" name="title" style="width:100%" value="{{ task.task.title }}" />
        </form></td>

    </tr>
{% endfor %}
    <tr>
        <td colspan="3"></td>
        <td width="100%" style="padding-left:{% widthratio 0 10 200 %}px">
        <form class="task" action="/tasks/new" method="post">
            <input type="text" name="title" />
            <input type="submit" value="Add" />
        </form></td>
    </tr>
</table>

<h1>Switch log:</h1>
<table class="switches">
<thead>
<tr>
    <td>Task</td>
    <td>Duration</td>
    <td>Started</td>
    <td>Comment</td>
</tr>
</thead>
{% for switch in switches %}
<tr>
    <td> {{ switch.task.full_title|join:" / " }} </td>
    <td> {{ switch.duration }} </td>
    <td> {{ switch.started|date:"Y-m-d H:i:s" }} </td>
    <td><form action="/tasks/update_task_switch" method="post" style="margin:0">
        <input type="hidden" name="task_switch" value="{{ switch.key.id }}">
        <input name="comment" value="{{ switch.comment|default:"" }}" size="50">
        <input type="submit" value="Update">
    </form></td>
</tr>
{% endfor %}
</table>

</body>

{% endautoescape %}
</html>
